const types = {
    INIT_LEFT_MENU:'INIT_LEFT_MENU',    // 初始化左侧菜单
    SET_LEFT_COLLAPSE: 'SET_LEFT_COLLAPSE', //改变左边菜单的收缩宽度
    HANDLE_LEFT_MENU:'HANDLE_LEFT_MENU' //收缩左侧菜单
}
const menu = {
    state: {
        minLeftMenuWidth: 35,
        maxLeftMenuWidth: 180,
        sidebar: {
            opened: true,
            width: 180
        },
        isCollapse: false, //菜单默认展开
        isFooter: false
    },
    getters : {
        sidebar:state => state.sidebar,
        isCollapse:state => state.isCollapse,
        isFooter:state => state.isFooter
    },
    mutations: {
      [types.INIT_LEFT_MENU] (state) {
        state.sidebar = state.sidebar
      },
      [types.SET_LEFT_COLLAPSE] (state) {  
        state.isCollapse = !state.isCollapse 
      },
      [types.HANDLE_LEFT_MENU] (state) {  
        if(state.sidebar.opened) {
            state.sidebar.width = state.minLeftMenuWidth;
        } else {
            state.sidebar.width = state.maxLeftMenuWidth;
        }
        state.sidebar.opened = !state.sidebar.opened;
      },
    },
    actions: {
        setLeftCollapse: ({commit}) => {
            commit(types.SET_LEFT_COLLAPSE)
        },
        initLeftMenu: ({commit}) => {
            commit(types.INIT_LEFT_MENU)
        },
        handleLeftMenu: ({commit}) => {
            commit(types.HANDLE_LEFT_MENU)
        }
    }
}

export default menu